<template>
  <el-breadcrumb separator="/">
    <el-breadcrumb-item v-if="firstTitle" :to="getPath()">{{ firstTitle }}</el-breadcrumb-item>
    <el-breadcrumb-item>{{ title }}</el-breadcrumb-item>
  </el-breadcrumb>
</template>

<script>
export default {
  name: 'Index',
  props: {
    titleName: {
      type: String,
      default: ''
    }
  },
    watch:{
        titleName:{
            handler(newV,oldV){
                if (newV){
                    this.title = newV
                }
            },
            deep:true
        }
    },
  data: function() {
    return {
      title: '标题',
      firstTitle: '',
      path: ''
    }
  },
  mounted: function() {
    console.log(this.$route.meta)
    this.title = this.titleName || this.$route.meta.title
    this.firstTitle = this.$route.meta.activeTitle
    this.path = this.$route.meta.activeMenu
  },
  methods: {
    getPath: function() {
      return { path: this.path, query: { t: new Date().getTime() }}
    },
    firstClick: function() {
      this.$router.push()
    }
  }
}
</script>

<style scoped>

</style>
